import React, { memo, useEffect } from "react";
import { useDispatch, useSelector, shallowEqual } from "react-redux";
import { DjRadioRightWrap } from "./style";
import { getDjRadioHotList } from "../store/actionType";
import { getSizeImage } from "@/utils/format-utils";
import { NavLink } from "react-router-dom";
import Deploy from "@/components/deploy";

export default memo(function DjRadioRight(props) {
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(getDjRadioHotList(props.catagory, 10, 0));
  }, [dispatch, props.catagory, props.id]);

  const state = useSelector(
    (state) => ({
      catagories: state.getIn(["djradio", "djRadioHotList"]),
    }),
    shallowEqual
  );

  return (
    <DjRadioRightWrap>
      <Deploy
        title={"你可能也喜欢"}
        catagories={state.catagories}
        radioPage={true}
      />
    </DjRadioRightWrap>
  );
});
